// 导入路由模块下的静态路由表
import { constantRoutes, asyncRoutes } from '@/router'

const state = () => {
  return {
    // 路由表：初始值是静态路由表的值
    routes: constantRoutes
  }
}

const mutations = {
  setRoutes: (state, showAasync) => {
    // 给route数组追加筛选后的动态路由表
    // state.routes.push(...showAasync)
    // 或
    state.routes = [
      ...constantRoutes,
      ...showAasync
    ]
  },
  // 删除路由表
  removeRoutes: (state) => {
    state.routes = []
  }
}

const actions = {
  // 筛选动态路由表
  filterAsync: ({ commit }, menus) => {
    // 基于动态路由表和 menus 数组筛选
    // 基于当前用户信息中 roles.menus 数组来筛选动态路由表
    // 筛选的条件：判断当前路由第一个childrn的名字是否在menus数组中
    // 在的话，就留下(拥有的权限/菜单):否则就过滤掉了，舍去了(不开放)
    const showAsyncRoutse = asyncRoutes
      .filter(item => menus.includes(item.children[0].name))
    // 提交mutation , 传入筛选结果作为参数
    commit('setRoutes', showAsyncRoutse)
    // 返回筛选结果(给动态守卫那边用)
    return showAsyncRoutse
  }
}

export default {
  // 开启命名空间，防止重名
  namespaced: true,
  state,
  mutations,
  actions
}
